<!DOCTYPE html>
<html lang="en">

<head>

    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>单步执行</title>

    <link rel="icon" href="img/logo.png" type="image/x-icon" />

    <script src="js/jquery.min.js"></script>

    <!-- eel(python) -->
    <script type="text/javascript" src="./eel.js"></script>

    <!-- Import Vue 3 -->
    <script src="js/m_vue3.js"></script>
    <script src="https://cdn.jsdelivr.net/npm/vue@3"></script>

    <!-- vue 路由 -->
    <!-- <script src="https://cdn.bootcdn.net/ajax/libs/vue-router/4.1.6/vue-router.global.js"></script> -->

    <!-- axios -->
    <script src="js/m_axios.js"></script>
    <!-- <script src="https://cdn.jsdelivr.net/npm/axios/dist/axios.min.js"></script> -->

    <!-- Import component library -->
    <script src="js/m_element-plus.js"></script>
    <!-- <script src="https://unpkg.com/element-plus"></script> -->

    <!-- echarts -->
    <!-- <script src="js/echarts.js"></script> -->
    <script src="js/echart.min.js"></script>

    <!-- icon -->
    <!-- <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css"
            integrity="sha512-SfTiTlX6kk+qitfevl/7LibUOeJWlt9rbyDn92a1DqWOw9vWG2MFoays0sgObmWazO5BQPiFucnnEAjpAB+/Sw=="
            crossorigin="anonymous" referrerpolicy="no-referrer" /> -->
    <link rel="stylesheet" href="css/font-awesome.min.css">

    <!-- Import style -->
    <link rel="stylesheet" href="css/m_element-plus.css">
    <!-- <link rel="stylesheet" href="https://unpkg.com/element-plus/dist/index.css" /> -->

    <!-- 引入样式 -->
    <link rel="stylesheet" href="css/m_vxe-table.css">
    <!-- <link rel="stylesheet" href="https://unpkg.com/vxe-table@next/lib/style.css"> -->
    <!-- 引入脚本 -->
    <script src="js/m_xe-utils.js"></script>
    <!-- <script src="https://unpkg.com/xe-utils"></script> -->
    <script src="js/m_vx-table.js"></script>
    <!-- <script src="https://unpkg.com/vxe-table@next"></script> -->

    <link rel="stylesheet" href="css/index.css">
    <link rel="stylesheet" href="css/step.css">

</head>

<body>

    <div id="app">
        <!-- 整个屏幕container -->
        <el-container class="index_container">
            <!-- mian-aside 左边 -->
            <el-aside width="200px" class="index_aside">
                <!-- aside 的顶部（icon 和 title） -->
                <div class="index_aside_top">
                    <img src="img/logo.png" alt="logo">
                    <span>TiTiuper</span>
                </div>

                <div class="index_aside_menu">
                    <!-- index 首页 -->
                    <div class="index_aside_menu_item" @click="jumpToHomeHtml">
                        <img src="/img/menu/index_gray.png" alt="单步执行">
                        <span>Home Index</span>
                    </div>
                    <!-- 单步执行 -->
                    <div class="index_aside_menu_item" @click="jumpToSetpHtml">
                        <img src="/img/menu/run_gray.png" alt="单步执行">
                        <span>Step Run</span>
                    </div>
                    <!-- 多股票执行 -->
                    <div class="index_aside_menu_item index_aside_menu_item_selected" @click="jumpToDebugHtml">
                        <img src="/img/menu/column.png" alt="多股票执行">
                        <span>Stra Debug</span>
                    </div>
                    <!-- 策略管理 -->
                    <div class="index_aside_menu_item" @click="jumpToStrategyHtml">
                        <img src="/img/menu/task_gray.png" alt="策略管理">
                        <span>Stra Managy</span>
                    </div>
                    <!-- 运营管理 -->
                    <div class="index_aside_menu_item" @click="jumpTooperationHtml">
                        <img src="/img/menu/list_gray.png" alt="运营管理">
                        <span>Operate List</span>
                    </div>
                    <!-- 设置 -->
                    <!-- <div class="index_aside_menu_item">
                    <img src="/img/menu/setting_gray.png" alt="设置">
                    <span>Setting</span>
                </div> -->
                </div>

            </el-aside>

            <el-main>


                <el-header>
                    <el-container>
                        <i class="fa fa-linkedin-square margin10" style="margin: 0 10px;"></i>
                        <el-breadcrumb separator="/">
                            <el-breadcrumb-item :to="{ path: '/' }">homepage</el-breadcrumb-item>
                            <el-breadcrumb-item><a href="">promotion management</a></el-breadcrumb-item>
                            <el-breadcrumb-item>promotion list</el-breadcrumb-item>
                            <el-breadcrumb-item>promotion detail</el-breadcrumb-item>
                        </el-breadcrumb>
                    </el-container>
                    <el-divider />
                </el-header>

                <el-card class="main_card">

                    <el-scrollbar max-height="100%">

                        <el-main class="index_main">


                            <el-tooltip placement="top">
                                <template #content>{{testContent}}</template>
                                <el-button>Top center</el-button>
                            </el-tooltip>

                        </el-main>
                    </el-scrollbar>
                </el-card>
            </el-main>
        </el-container>
    </div>
    <script>


        // 打开警告弹窗
        const warn_noStrategy = () => {
            ElNotification({
                title: 'Warning',
                message: 'This is a warning message',
                type: 'warning',
            })
        };

        const App = {
            el: '#app',
            data() {
                return {
                    "testContent": "",
                }
            },


            methods: {


                //测试跳转test.html
                jumpToHomeHtml() {
                    window.location.href = "/home.html";
                },
                jumpToSetpHtml() {
                    window.location.href = "/step.html";
                },
                jumpToDebugHtml() {
                    window.location.href = "/debug.html";
                },
                jumpToStrategyHtml() {
                    window.location.href = "/strategy.html";
                },
                jumpTooperationHtml() {
                    window.location.href = "/operation.html";
                },


                async test() {
                    let str = '{increase(2)} <0 and abs({increase(1)}) <0.005 and {increase(0)} >0 and {close} > (({open(2)} + {close(2)})/2)    and    {close(1)}<{close(2)}  and {close(1)} < {open} and  {open(1)}<{close(2)}  and {open(1)} < {open}'
                    console.log(str);
                    returnStr = await eel.test(str)();
                    console.log(returnStr);
                    this.testContent = returnStr;
                },


            },
            /*end - method */



            mounted() {

                this.xtable = this.$refs.m_xTable;
                this.test();
            },

        }

        const app = Vue.createApp(App);
        app.use(ElementPlus);
        app.use(VXETable);
        app.mount("#app");


    </script>

</body>

</html>